<template>
  <div class="page-wrap">
    <Table class='table' filter v-bind="tableOpts" v-on="tableEvent">
      <template #operator>
        <div class="operator-wrap">
          <modifyOut ref="outRef" @change="fetchCurrentTable"/>
          <modifyInstall ref="installRef" @change="fetchCurrentTable"/>
          <InstallList ref="installListRef" @change="fetchCurrentTable"/>
          <!-- <ClassifyDetail ref="classifyDetailRef" @change="fetchCurrentTable" /> -->
          <ParseDetail ref="ParseDetailRef" @change="fetchCurrentTable"/>
        </div>
      </template>
    </Table>
  </div>
</template>

<script>
import tableMixins from "@/mixins/tableMixins.vue";
import modifyOut from "./components/modifyOut.vue";
import modifyInstall from "./components/modifyInstall.vue";
import InstallList from "./InstallList.vue";
import ClassifyDetail from "./ClassifyDetail.vue";
import ParseDetail from "./components/ParseDetail.vue";
import dayjs from "dayjs";

export default {
  name: "OrderWarehouse",
  mixins: [tableMixins],
  components: {
    modifyOut,
    modifyInstall,
    InstallList,
    ClassifyDetail,
    ParseDetail,
  },
  data() {
    return {
      apiName: "orderList",
      form: {
        storeName: {
          tag: "el-input",
          label: "订单名称",
          value: "",
          props: {
            clearable: true,
            placeholder: "请输入订单名称",
          },
        },
        areaId:this.formArea(),
        creatorName: {
          tag: "el-input",
          label: "创建人名称",
          value: "",
          props: {
            clearable: true,
            placeholder: "请输入创建人名称",
          },
        },
        orderBy: {
          tag: "el-select",
          label: "排序规则",
          value: 1,
          items: [
            {label: "默认排序", value: 1},
            {label: "发货日期", value: 2},
            {label: "修改时间", value: 3},
          ],
          props: {},
        },
        outStatus: {
          tag: "el-select",
          label: "出库状态",
          value: -1,
          items: [
            {label: "全部", value: -1},
            {label: "待出库", value: 0},
            {label: "部分出库", value: 1},
            {label: "全部出库", value: 2},
          ],
          props: {},
        },
        orderType: {
          tag: "el-select",
          label: "订单类型",
          value: 1,
          items: [
            {label: "新增店铺", value: 1},
            {label: "老店升级", value: 2},
          ],
          props: {},
        },
        startTime: {
          tag: "el-date-picker",
          label: "开始日期",
          value: "",
          props: {
            clearable: true,
            placeholder: "请选择开始日期",
            pickerOptions: {
              // disabledDate (time) {
              // 	return time.getTime() < dayjs().startOf("day").valueOf();
              // },
            },
          },
        },
        endTime: {
          tag: "el-date-picker",
          label: "结束日期",
          value: "",
          props: {
            clearable: true,
            placeholder: "请选择结束日期",
            pickerOptions: {
              // disabledDate (time) {
              // 	return time.getTime() < dayjs().startOf("day").valueOf();
              // },
            },
          },
        },
      },
    };
  },
  computed: {
  },

  methods: {
    handleAction(opts, row) {
      const {storeName: name, id} = row;
      console.log(row, opts)
      let ref = null;
      if (opts.includes("new")) {
        const map = {
          newOrderStorageList: "仓储货架清单",
          newOrderAdditionList: "杂项清单",
          newOrderMaterialList: "货架清单",
        };
        if (opts == "newOrderMaterialList") {
          let dataArr = []
          return this.$api.newOrderMaterialList({id}).then(res => {
            // console.log(res,"材料")
            // console.log(window?.g_config?.productMap2,"productMap2")
            // console.log(window?.g_config?.productColumns2,"productColumns2")
            // console.log(window?.g_config?.productSort2,"productSort2")
            this.$api.newOrderAdditionList({id}).then(res2 => {
              dataArr = [...res, ...res2]
              this.$quinn.exportExcel({
                data: dataArr,
                sort: false,
                group: opts != "newOrderAdditionList",
                defaultTitle: `${map[opts]}-${name}`,
                productMap: window?.g_config?.productMap2 || {},
                productSort: window?.g_config?.productSort2 || [],
                productColumns: window?.g_config?.productColumns2 || {},
              });
            })
          })
        } else if (opts == "newOrderStorageList") {
          let dataArr = []
          return this.$api.newOrderStorageList({id}).then(res => {
            this.$api.newOrderAdditionList({id}).then(res2 => {
              dataArr = [...res, ...res2]
              this.$quinn.exportExcel({
                data: dataArr,
                sort: false,
                group: opts != "newOrderAdditionList",
                defaultTitle: `${map[opts]}-${name}`,
                productMap: window?.g_config?.productMap2 || {},
                productSort: window?.g_config?.productSort2 || [],
                productColumns: window?.g_config?.productColumns2 || {},
              });
            })
          })
        }
      } else if (opts == "delete")
        this.showConfirm(`确认删除【${name}】？`, "orderOrderDelete", {
          id,
          type: "warehouse",
        });
      else if (["storageDetail", "goodsDetail"].includes(opts)) {
        row.type = opts.replace("Detail", "");
        ref = this.$refs.ParseDetailRef;
        // classifyDetailRef;
      } else if (opts == "out") {
        ref = this.$refs.outRef;
      } else if (opts == "install") {
        ref = this.$refs.installRef;
      } else if (opts == "installList") {
        ref = this.$refs.installListRef;
      }

      ref && ref.showDialog(opts, row);
    },
    formatQuery(params) {
      try {
        // const d = dayjs(params.delivery);
        const s = dayjs(params.startTime);
        const e = dayjs(params.endTime);
        // if (d.isValid()) params.deliveryDate = d.format("YYYY-MM-DD");
        if (s.isValid()) params.startTime = s.format("YYYY-MM-DD");
        if (e.isValid()) params.endTime = e.format("YYYY-MM-DD");
        // const d = dayjs(params.delivery);
        // if (d.isValid()) params.deliveryDate = d.format("YYYY-MM-DD");
      } catch (e) {
        console.log(e);
      }
      if (params.outStatus == -1) delete params.outStatus;
      // params.type = "warehouse";
      params.type = 1
      return params;
    },
  },
};
</script>

<style lang="less" scoped>
.table /deep/ .el-image {
  //border: 4px solid #15f5d0;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border-radius: 3px;
}
</style>
